<template>
  <el-card shadow="never">
    <div slot="header" class="card-header">
      <div class="card-title">
        <i class="el-icon-star-on"></i>
        <strong>重点模型</strong>
      </div>
    </div>
    <el-tabs type="border-card">
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-star-off"></i> 涉敏操作未经金库审批
        </span>
        <el-table :data="tableDataA" border style="width: 100%">
          <el-table-column prop="columnA" label="日志编号"> </el-table-column>
          <el-table-column prop="columnB" label="是否非用户授权">
          </el-table-column>
          <el-table-column prop="columnC" label="操作时间"> </el-table-column>
          <el-table-column prop="columnD" label="敏感信息"> </el-table-column>
          <el-table-column prop="columnE" label="是否金库授权">
          </el-table-column>
          <el-table-column prop="columnF" label="审批ID为空"> </el-table-column>
          <el-table-column prop="columnG" label="日志无关联"> </el-table-column>
          <el-table-column prop="columnH" label="是否判违规"> </el-table-column>
        </el-table>
        <div class="pagination">
          <Pagination />
        </div>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-star-off"></i> 审批人与申请人非同一部门
        </span>
        <el-table :data="tableDataB" border style="width: 100%">
          <el-table-column prop="columnA" label="账号名称"> </el-table-column>
          <el-table-column prop="columnB" label="审批人部门"> </el-table-column>
          <el-table-column prop="columnC" label="申请人部门"> </el-table-column>
          <el-table-column prop="columnD" label="是否存在风险">
          </el-table-column>
        </el-table>
        <div class="pagination">
          <Pagination />
        </div>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-star-off"></i> 厂商人员作为金库授权人
        </span>
        <el-table :data="tableDataC" border style="width: 100%">
          <el-table-column prop="columnA" label="日志编号"> </el-table-column>
          <el-table-column prop="columnB" label="金库审批日志">
          </el-table-column>
          <el-table-column prop="columnC" label="审批人为厂商人员">
          </el-table-column>
          <el-table-column prop="columnD" label="是否存在风险">
          </el-table-column>
        </el-table>
        <div class="pagination">
          <Pagination />
        </div>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-star-off"></i> 操作时间不在授权范围内
        </span>
        <el-table :data="tableDataD" border style="width: 100%">
          <el-table-column prop="columnA" label="日志名称"> </el-table-column>
          <el-table-column prop="columnB" label="操作时间"> </el-table-column>
          <el-table-column prop="columnC" label="是否在范围内">
          </el-table-column>
          <el-table-column prop="columnD" label="是否违规"> </el-table-column>
        </el-table>
        <div class="pagination">
          <Pagination />
        </div>
      </el-tab-pane>
      <el-tab-pane>
        <span slot="label">
          <i class="el-icon-star-off"></i> 授权时长超规定（超3小时）
        </span>
        <el-table :data="tableDataE" border style="width: 100%">
          <el-table-column prop="columnA" label="日志编号"> </el-table-column>
          <el-table-column prop="columnB" label="操作时间"> </el-table-column>
          <el-table-column prop="columnC" label="金库审批时间">
          </el-table-column>
          <el-table-column prop="columnD" label="是否超过3小时">
          </el-table-column>
          <el-table-column prop="columnE" label="是否违规"> </el-table-column>
        </el-table>
        <div class="pagination">
          <Pagination />
        </div>
      </el-tab-pane>
    </el-tabs>
  </el-card>
</template>

<script>
import Pagination from './Pagination'
export default {
  components: {
    Pagination
  },

  data() {
    return {
      tableDataA: [
        {
          columnA: 'R1024425',
          columnB: '非用户授权',
          columnC: '2020.3.12',
          columnD: '波音737',
          columnE: '否',
          columnF: '空',
          columnG: '无关联',
          columnH: '违规'
        },
        {
          columnA: 'R1029832',
          columnB: '非用户授权',
          columnC: '2020.3.12',
          columnD: '西藏',
          columnE: '否',
          columnF: '空',
          columnG: '无关联',
          columnH: '违规'
        },
        {
          columnA: 'R10382761',
          columnB: '非用户授权',
          columnC: '2020.3.12',
          columnD: '越南',
          columnE: '否',
          columnF: '空',
          columnG: '无关联',
          columnH: '违规'
        }
      ],
      tableDataB: [
        {
          columnA: 'RFB23134',
          columnB: '技术部',
          columnC: '市场部',
          columnD: '是'
        },
        {
          columnA: 'RFB44212',
          columnB: '技术部',
          columnC: '市场部',
          columnD: '是'
        },
        {
          columnA: 'SCB52132',
          columnB: '市场部',
          columnC: '综合部',
          columnD: '是'
        }
      ],
      tableDataC: [
        {
          columnA: 'R039912',
          columnB: '是',
          columnC: '是',
          columnD: '是'
        },
        {
          columnA: 'R129123',
          columnB: '是',
          columnC: '是',
          columnD: '是'
        },
        {
          columnA: 'R201923',
          columnB: '是',
          columnC: '是',
          columnD: '是'
        }
      ],
      tableDataD: [
        {
          columnA: 'R033212',
          columnB: '2020.5.22',
          columnC: '否',
          columnD: '是'
        },
        {
          columnA: 'R141232',
          columnB: '2020.5.22',
          columnC: '否',
          columnD: '是'
        },
        {
          columnA: 'R123218',
          columnB: '2020.5.22',
          columnC: '否',
          columnD: '是'
        }
      ],
      tableDataE: [
        {
          columnA: 'R033212',
          columnB: '2020.6.30 17：32：00',
          columnC: '2020.6.30 17：33：00',
          columnD: '否',
          columnE: '否'
        },
        {
          columnA: 'R141232',
          columnB: '2020.6.30 17：52：00',
          columnC: '2020.6.30 18：33：00',
          columnD: '是',
          columnE: '是'
        },
        {
          columnA: 'R123218',
          columnB: '2020.6.30 18：24：00',
          columnC: '2020.6.30 18：58：00',
          columnD: '否',
          columnE: '否'
        }
      ],
      tableDataF: [
        {
          columnA: 'FF121435',
          columnB: '是',
          columnC: '是',
          columnD: '是',
          columnE: '2020.6.20'
        },
        {
          columnA: 'RR976231',
          columnB: '是',
          columnC: '是',
          columnD: '是',
          columnE: '2020.6.20'
        },
        {
          columnA: 'BG421864',
          columnB: '是',
          columnC: '是',
          columnD: '是',
          columnE: '2020.6.20'
        }
      ]
    }
  }
}
</script>

<style lang="scss" scoped>
.card-title {
  display: flex;
  align-items: center;
  i {
    font-size: 22px;
    margin-right: 4px;
  }
}
.pagination {
  float: right;
  margin: 10px;
}
</style>
